<script type="text/javascript" src="/js/widget/jcarousel.js"></script>
<style type="text/css">

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 99%;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width: 100%;
}
</style>

<div class="clear"></div>
<div class="menu-int">
        
        <p class="menu-int-li borderCornersTop backgroundWhite">Productos Oferta</p>
        
        <div class="menu-int-content borderCornersBottom">


<ul id="jcarousel_Oferta" class="jcarousel jcarousel-skin-tango">
<?php  include_partial('componentes/productoCentro', array('productos' => $productos)) ?>
</ul>
<!--Incluye el efecto de carrusel de los productos-->
<script type="text/javascript">
    
    function mycarousel_initCallback(carousel)
{
    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(0);
    });

    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

   jQuery(document).ready(function() {
     jQuery('#jcarousel_Oferta').jcarousel({
        auto: 2,
        wrap: 'circular',
        initCallback: mycarousel_initCallback
    });
}); 

</script> 
        </div>
                
</div>                
                
<div class="clear"></div>